<!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:s="http://jboss.com/products/seam/taglib"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:rich="http://richfaces.org/rich"
	template="layout/template.xhtml">

	<ui:define name="body">

		<s:remote include="trivia"/>
		<script type="text/javascript">
var currentQuestion;
var messages = null;
Seam.Remoting.eval("#" + "{messages}", function(value) {
	messages = value;
});

function askQuestion() {
	if (!messages) {
		alert("Messages still loading");
		return;
	}
	Seam.Component.getInstance("trivia").drawQuestion(poseQuestion);
}

function poseQuestion(triviaQuestion) {
	if (triviaQuestion == null) {
		alert("Sorry, you have answered all of the questions.");
		return;
	}
	if (triviaQuestion.getAnswer() != undefined) {
		alert("This quiz has been compromised!");
		return;
	}
	currentQuestion = triviaQuestion;
	var response = window.prompt(triviaQuestion.question);
	if (response) {
		Seam.Component.getInstance("trivia").answerQuestion(triviaQuestion.getQuestion(), response, reportResult);
	}
}

function reportResult(result) {
	alert(result ? messages.get("response.correct") : messages.get("response.incorrect"));
	if (!result) {
		poseQuestion(currentQuestion);
	}
}
		</script>
		<div id="banner">
			<h1>#{messages['application.title']}</h1>
			<h2>...#{messages['application.tagline']}</h2>
			<s:fragment rendered="#{not identity.loggedIn}">
				<p>Not a member?#{' '}<s:link id="register" value="Sign up now!" view="/register.xhtml" /></p>
			</s:fragment>
		</div>

		<p><a href="javascript: void(0)" onclick="askQuestion();">Quiz me!</a></p>
		<h:messages globalOnly="true" styleClass="message" errorClass="errormsg" infoClass="infomsg" warnClass="warnmsg"/>
    
		<h:panelGrid columns="2" columnClasses="panel-column" cellpadding="0" cellspacing="0">
			<rich:panel styleClass="main-panel">
				<f:facet name="header">About Open 18</f:facet>
				<p>Open 18 is a golf course directory and community site for golf players.</p>
				<p><strong>Golf course directory:</strong></p>
				<p>The golf course directory allows you to browse for golf facilities/courses or search for one in your area. The information available includes the facility, the course, the holes, the tee sets and the tees.</p>
				<p><strong>The clubhouse:</strong></p>
				<p>The clubhouse is a social utility that allows you to connect with other golfers. When you register to become a golfer, you will get a profile, which you can share with others. Along with that profile, you can track your golf rounds and publish personal experiences.</p>
			</rich:panel>
			<h:panelGroup>
				<rich:panel styleClass="module-box">
					<f:facet name="header">Cool New Golfers</f:facet>
	
					<!-- NOTE: it appears "empty newGolfers" doesn't work when using the manager component -->
					<s:div rendered="#{newGolfers.size eq 0}">
					  It's really quite around here!
					</s:div>
	
					<h:form rendered="#{newGolfers.size ge 0}">
						<rich:dataList var="_golfer" value="#{newGolfers.wrappedData}"> <!-- use wrappedData to prevent dataModelSelection parameter on s:link -->
							<ui:remove>
							<h:commandLink action="#{profileAction.view(_golfer)}" value="#{_golfer.name} (#{_golfer.username})"/>
							<s:link action="#{profileAction.view}" value="#{_golfer.name} (#{_golfer.username})"/>
							<s:link action="#{profileAction.view(_golfer)}" value="#{_golfer.name} (#{_golfer.username})"/>
							</ui:remove>
							<s:link view="/profile.xhtml" value="#{_golfer.name}">
								<f:param name="golferId" value="#{_golfer.id}"/>
							</s:link><ui:remove>(#{_golfer.username})</ui:remove>
						</rich:dataList>
					</h:form>
				</rich:panel>
				<rich:panel styleClass="module-box">
					<f:facet name="header">Locate Golfer</f:facet>
						<h:panelGrid columns="2" styleClass="simpleFormLayout" cellspacing="0" cellpadding="0">
							<h:panelGroup>
								<label for="profileId">By ID:</label>
							</h:panelGroup>
							<h:panelGroup>
								<form action="#{facesContext.externalContext.requestContextPath}/profile.seam">
									<input id="profileId" type="text" style="width: 2em;" name="golferId" />
									<input type="submit" value="Go &#187;" style="margin: 0 0 1px 0; padding-top: 0;"/>
								</form>
							</h:panelGroup>
							<h:panelGroup>
								<label for="profileUsername">By username:</label>
							</h:panelGroup>
							<h:panelGroup>
								<form action="#{facesContext.externalContext.requestContextPath}/profile.seam">
									<input id="profileUsername" type="text" style="width: 6em;" name="username" />
									<input type="submit" value="Go &#187;" style="margin: 0 0 1px 0; padding-top: 0;"/>
								</form>
							</h:panelGroup>
						</h:panelGrid>
				</rich:panel>
			</h:panelGroup>
		</h:panelGrid>
	</ui:define> 
</ui:composition>
